<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="jquery-1.11.1.min.js"></script>
    <script>
        var data = [{
            "name":"abc",
            "url":"http://www.baidu.com",
            "type":"培训"
        },{
            "name":"abc",
            "url":"http://www.baidu.com",
            "type":"培训"
        },{
            "name":"abc",
            "url":"http://www.baidu.com",
            "type":"培训"
        }];
        $(function(){
            $("#createTal").click(function(){
                var html = "";
                for(var i = 0;i<data.length;i++){
                    html += "<tr>";
                    html += "<td>" + data[i].name + "</td>";
                    html += "<td>" + data[i].url + "</td>";
                    html += "<td>" + data[i].type + "</td>";
                    html += "</tr>";
                }
                $("#tBodyEl").html(html);
            })
        })
    </script>
</head>
<body>
<input type="button" value="动态创建表格" id="createTal">
  <table border="1px" style="color: #0099cc" cellspacing="0px" cellpadding="10px">
      <thead>
         <tr>
             <th>标题</th>
             <th>地址</th>
             <th>说明</th>
         </tr>
      </thead>
      <tbody id="tBodyEl">

      </tbody>
  </table>
</body>
</html>